<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>五行</title>
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
    />
    <style>
      body {
        background: #e4dad0;
        font-size: 12px;
        width: 100%;
      }
      ul,
      li {
        list-style: none;
        margin: 0;
        padding: 0;
      }
      .countBox {
        width: 100%;
        overflow-x: scroll;
      }
      .countBox ul {
        width: 1000px;
      }
      li {
        overflow: hidden;
        border-right: 1px solid #ebebeb;
        border-bottom: 1px solid #ebebeb;
      }
      li div {
        width: 100px;
        float: left;
        border-left: 1px solid #ebebeb;
        padding: 4px 0;
        background: #c7baaa;
      }
      input[type="submit"] {
        display: block;
        padding: 0;
        border: 0;
        width: 90%;
        margin: 10px auto;
        height: 40px;
        line-height: 40px;
        text-align: center;
        color: #7b6d53;
        border: 1px solid #a79e8d;
        background: #eaddcd;
        outline: none;
      }
      .form div {
        padding-bottom: 10px;
      }
      .form div input {
        display: block;
        background: #c7baaa;
        width: 90%;
        margin: 0 auto;
        height: 36px;
        border: none;
        outline: none;
        line-height: 36px;
      }
    </style>
  </head>
  <body>
    <div class="form">
      <div>
        止损：(单轮最大亏损)<input
          type="text"
          id="stops"
          value="200000000"
          oninput="checkColor(this)"
        />
      </div>
      <div>
        最小收益：(单次中五行时最小收益)<input
          type="text"
          id="minGains"
          value="8000000"
          oninput="checkColor(this)"
        />
      </div>
      <div>
        单次最大投入：(单次竞猜做大赌注，一般玩法防止爆60倍超额)<input
          type="text"
          id="maxSingle"
          value="30000000"
          oninput="checkColor(this)"
        />
      </div>
      <div>
        最小投入递增：(需要调整赌注时，最小调整金额)<input
          type="text"
          id="inputStep"
          value="100000"
          oninput="checkColor(this)"
        />
      </div>
      <input type="submit" value="计算" onclick="count()" />
    </div>
    <div class="countBox">
      <ul id="count"></ul>
    </div>
    <script>
      const count = () => {
        document.getElementById("count").innerHTML = `
        <li>
            <div>次数</div>
            <div>单次投注</div>
            <div>5倍收益</div>
            <div>5倍概率</div>
            <div>12倍收益</div>
            <div>12倍概率</div>
            <div>60倍收益</div>
            <div>60倍概率</div>
            <div>总投注</div>
        </li>
        `;

        let stops = parseInt(document.getElementById("stops").value); // 最小收益 100万
        let minGains = parseInt(document.getElementById("minGains").value); // 最小收益 100万
        let maxSingle = parseInt(document.getElementById("maxSingle").value); // 最大单次投入 3000万
        let inputStep = parseInt(document.getElementById("inputStep").value); // 单次投入递增 10万
        let bettingNum = 0; // 当前投注次数
        let prevInput = 0; // 上一次投注数
        let totalInput = 0; // 当前投入总和
        let isBet = (single, total) => {
          if (single * 4 - total >= minGains && single + total <= stops) {
            return true;
          }
          return false;
        };
        let fn = () => {
          if (prevInput > maxSingle) {
            console.log("单次投注超过", maxSingle, "停止程序");
            return false;
          }
          if (isBet(prevInput + inputStep, totalInput)) {
            bettingNum++;
            console.log("准备第[", bettingNum, "]次投注");
            totalInput += prevInput + inputStep;
            console.log("当前投注：", prevInput + inputStep);
            console.log("5倍收益：", (prevInput + inputStep) * 5 - totalInput);
            console.log(
              "12倍收益：",
              (prevInput + inputStep) * 12 - totalInput
            );
            console.log(
              "60倍收益：",
              (prevInput + inputStep) * 60 - totalInput
            );
            console.log("当前总投注：", totalInput);
            console.log("=================");

            let arr = [];
            arr.push(bettingNum);
            arr.push(prevInput + inputStep);
            arr.push((prevInput + inputStep) * 5 - totalInput);
            arr.push(
              Math.round(
                (1 - Math.round(Math.pow(4 / 5, bettingNum) * 10000) / 10000) *
                  10000
              ) /
                100 +
                "%"
            );
            arr.push((prevInput + inputStep) * 12 - totalInput);
            arr.push(
              Math.round(
                (1 -
                  Math.round(Math.pow(11 / 12, bettingNum) * 10000) / 10000) *
                  10000
              ) /
                100 +
                "%"
            );
            arr.push((prevInput + inputStep) * 60 - totalInput);
            arr.push(
              Math.round(
                (1 -
                  Math.round(Math.pow(59 / 60, bettingNum) * 10000) / 10000) *
                  10000
              ) /
                100 +
                "%"
            );
            arr.push(totalInput);
            let li = document.createElement("li");
            arr.map(item => {
              let dom = document.createElement("div");
              if (item < 100000 || isNaN(item)) {
                // 10万内
                color = "#000";
              } else if (item < 1000000) {
                // 10万
                color = "#84ff68";
              } else if (item < 10000000) {
                // 百万
                color = "#a251ba";
              } else if (item < 100000000) {
                // 千万
                color = "#ffed46";
              } else if (item < 1000000000) {
                // 亿
                color = "#da403e";
              } else {
                // 十亿
                color = "#4ee8ff";
              }
              dom.style.color = color;
              dom.innerText = item;
              li.appendChild(dom);
            });
            document.getElementById("count").appendChild(li);
            fn();
          } else {
            prevInput += inputStep;
            fn();
          }
        };
        fn();
      };
      const checkColor = dom => {
        let item = parseInt(dom.value);
        if (item < 100000 || isNaN(item)) {
          // 10万内
          color = "#000";
        } else if (item < 1000000) {
          // 10万
          color = "#84ff68";
        } else if (item < 10000000) {
          // 百万
          color = "#a251ba";
        } else if (item < 100000000) {
          // 千万
          color = "#ffed46";
        } else if (item < 1000000000) {
          // 亿
          color = "#da403e";
        } else {
          // 十亿
          color = "#4ee8ff";
        }
        dom.style.color = color;
      };
      checkColor(document.getElementById("stops"));
      checkColor(document.getElementById("minGains"));
      checkColor(document.getElementById("maxSingle"));
      checkColor(document.getElementById("inputStep"));
    </script>
  </body>
</html>
